<style>
    .demo-drawer-profile{
        font-size: 14px;
    }
    .demo-drawer-profile .ivu-col{
        margin-bottom: 50px;
    }
</style>
<template>
	<div>
		<Modal v-model="modalShow" :closable='false' :mask-closable=false fullscreen>
			<p slot="header">详情资料 </p>
			<Button  class="ivu-btn ivu-btn-error"  @click="payModel=true" style="position: fixed;right: 10px;top: 10px;">帮他充值</Button>
			<Modal
		        v-model="payModel"
		        title="用户充值"
		        :loading="payLoad"
		        @on-ok="p_ok"
		        @on-cancel="p_cancel">
		        <div class="demo-drawer-profile">
			       <Row>
	                    <Col span="12">
	                    	会员姓名：<span>{{formData.realname}}</span>
	                    </Col>
	                    <Col span="12">
	                    	会员账号：<span>{{formData.username}}</span>
	                    </Col>
	                    <Col span="12">
	                    	余额：  <span>{{formData.money}}</span>
	                    </Col>
	                    <Col span="12">
	                    	保证金：<span>{{formData.b_money}}</span>
	                    </Col>
	                     <Col span="14">
	                    	选择充值类型：
	                    	 <RadioGroup v-model="payData.type">
							        <Radio label="1" :true-value="1">余额</Radio>
							        <Radio label="2" :true-value="2">保证金</Radio>
    						</RadioGroup>
	                    </Col>
	                    <Col span="14">
	                    	充值金额： <Input v-model="payData.total_fee"/>
	                    </Col>
	                      <Col span="14">
	                    	备注： <Input v-model="payData.remark"/>
	                    </Col>
	                </Row>
                </div>
    		</Modal>
			 <div class="demo-drawer-profile">
			    <Row>
                    <Col span="12">
                        	头像：<Avatar icon="ios-person" size="large" :src="formData.head_img"/>
                    </Col>
                    <Col span="12">
                        	账号：<span>{{formData.username}}</span>
                    </Col>
                    <Col span="12">
                        	注册时间：<span>{{formData.create_time}}</span>
                    </Col>
                    <Col span="12">
                        	真实姓名：<span>{{formData.realname}}</span>
                    </Col>
                    <Col span="12">
                        	性别：<span>{{formData.sex_text}}</span>
                    </Col>
                    <Col span="12">
                        	准驾车型：<span>{{formData.drive_car_type}}</span>
                    </Col>
                    <Col span="12">
                        	驾驶证有效期：<span>{{formData.drive_start_time}}--{{formData.drive_end_time}}</span>
                    </Col>
                    <Col span="12">
                        	证件号码：<span>{{formData.card_sn}}</span>
                    </Col>
                    <Col span="12">
                        	证件地址：<span>{{formData.card_address}}</span>
                    </Col>
                    <Col span="12">
                        	身份证：<span>
                        		 <img :src="formData.card_z_img" width="100px" height="100px" style="margin-right: 5px;" @click="nImg($event)">
                        		 <img :src="formData.card_f_img" width="100px" height="100px" @click="nImg($event)">
                        	     </span>
                    </Col>
                    <Col span="12">
                        	驾驶证：<span>
                        		 <img :src="formData.drive_z_img" width="100px" height="100px" style="margin-right: 5px;" @click="nImg($event)">
                        		 <img :src="formData.drive_f_img" width="100px" height="100px" @click="nImg($event)">
                        	     </span>
                    </Col>
                </Row>
			 </div>

			<div slot="footer">
				<Button type="text" @click="cancel">取消</Button>
				<Button type="error" @click="refuse" v-if="formData.status == 2">拒绝</Button>
				<Modal v-if="formData.status == 2"
			        v-model="rModel"
			        title="拒绝理由"
			        @on-ok="r_ok"
			        @on-cancel="r_cancel">
			        <Input v-model="formData.un_remark" type="textarea" :autosize="{minRows: 2,maxRows: 5}"></Input>
    			</Modal>
				<Button type="primary" @click="edit" :loading='saveLoading' v-if="formData.status == 2">同意 </Button>
			</div>
		</Modal>

	</div>
</template>
<script>
	import {
		getInfo,
		applyUser,
		payUser
	} from '@/api/user1'

	//import Editor from '_c/editor'
	//import Upload from '_c/common/upload'
	export default {
		components: {
			//  Editor,
			//  Upload
		},
		props: {
			modalId: {
				type: Number,
				default: 0
			}
		},
		created() {
			let t = this;
			if(this.modalId > 0) {
				this.getInfoById()
			}
		},
		data() {
			let t = this;
			return {
				modalShow: true,
				saveLoading: false,
				payModel:false,
				payLoad:true,
				rModel:false,
				payData:{
					type:'',
					total_fee:'',
					remark:''
				},
				formData: {
					user_id:'',
					head_img:'',
					username:'',
					create_time:'',
					realname:'',
					sex_text:'',
					drive_car_type:'',
					drive_start_time:'',
					drive_end_time:'',
					card_sn:'',
					card_address:'',
					card_z_img:'',
					card_f_img:'',
					drive_z_img:'',
					drive_f_img:'',
					status:'',
					b_money:'',
					money:'',
					//提交数据
					un_remark:''
				},
			}
		},
		methods: {
			getInfoById() {
				let t = this
				getInfo(t.modalId).then(res => {
					//console.log(res);
					if(res.data.code == 1){
						let res_data = res.data.data;
					    t.formData =  {
					    	user_id:res_data.user_id,
							head_img:res_data.head_img,
							username:res_data.username,
							create_time:res_data.create_time,
							realname:res_data.realname,
							sex_text:res_data.sex_text,
							drive_car_type:res_data.drive_car_type,
							drive_start_time:res_data.drive_start_time,
							drive_end_time:res_data.drive_end_time,
							card_sn:res_data.card_sn,
							card_address:res_data.card_address,
							card_z_img:res_data.card_z_img,
							card_f_img:res_data.card_f_img,
							drive_z_img:res_data.drive_z_img,
							drive_f_img:res_data.drive_f_img,
							status:res_data.status,
							b_money:res_data.money_bag.b_money,
							money:res_data.money_bag.money
								
							
						}
					    
					}else{
						t.$Notice.error({
							title: res.data.msg
						})
						this.$emit('on-edit-modal-hide')
						this.modalShow = false
					}
					
				})

			},
			edit() {
				this.changeStatusExcute(this.formData.user_id,3)
			},
			refuse(){
				this.rModel =true;
			},
			cancel() {
				this.$emit('on-edit-modal-hide')
				this.modalShow = false
			},
			r_ok(){
				this.changeStatusExcute(this.formData.user_id,1,this.formData.un_remark)
			},
			r_cancel(){
				//清空
				this.formData.un_remark='';
			},
			p_ok(){
				let t = this;
				let params={
					'user_id':t.formData.user_id,
					'type':t.payData.type,
					'total_fee':t.payData.total_fee,
					'remark':t.payData.remark
				}
				
				let pay_text = t.payData.type == 1?'余额':'保证金';
	                if(confirm('确定充值'+pay_text+t.payData.total_fee+'元？')){
	                	payUser(params).then(res => {
	//					console.log(res);return;
						if(res.data.code == 1){
							
							t.$Notice.success({
										title: res.data.msg
								})
							//重载详情
							t.payModel = false;
							t.getInfoById();
							//制空
							t.payData = {
								type:'',
								total_fee:'',
								remark:''
							};
						}else{
							t.$Notice.error({
								title: res.data.msg
							})
							
							t.payLoad = false;
				            t.$nextTick(() => {
				              t.payLoad = true;
				            });
						}
						
					})	
                }
				
			},
			p_cancel(){
				let t = this;
						t.payData = {
							type:'',
							total_fee:'',
							remark:''
						};
			},
			changeStatusExcute(user_id,status,un_remark=''){
				let t = this;
                let params ={
                	'user_id':user_id,
                	'status':status,
                	'un_remark':un_remark
                }
				applyUser(params).then(res => {
							if(res.data.code == 1) {
								t.saveLoading = false
								t.modalShow = false
								t.$emit('on-edit-modal-success')
								t.$emit('on-edit-modal-hide')
								t.$Notice.success({
									title: res.data.msg
								})
							} else {
								t.saveLoading = false
								t.$Notice.error({
									title: res.data.msg
								})
							}

						}, function(error) {
							t.saveLoading = false
				})
			},
			nImg(e){
				let imgUrl = e.target.getAttribute('src');
				window.open(imgUrl); 
			}
			
		},

	}
</script>